<!DOCTYPE html>
<html xmlns:th="http://www.springframework.org/schema/mvc">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	<table id="manage_role" data-options="fit:true" ></table>
	<div id="role_add"></div>
	<div id="role_update"></div>


<script th:inline="none" type="text/javascript" >
	$(function(){
		$('#manage_role').edatagrid({
   	     	url:'/manage/role/selectallrole',
   	     	fitColumns:true,
   	    	rownumbers:true,
   	        columns:[[
   	            {field:'roleId',title:'id',width:30,hidden:true},
   	            {field:'roleName',title:'角色名称',width:150,editor: {type: 'textbox', options: {required: true}}},
				{field:'roleCode',title:'角色权限',width:150,editor: {type: 'textbox', options: {required: true}}},
   	            {field:'roleDescreption',title:'角色描述',width:200,editor: {type: 'textbox', options: {required: true}}},
   	            {field:'roleCreated',title:'创建时间',width:200},
   	            {field:'roleUpdated',title:'修改时间',width:200}
   	        ]],
			onSave: function (index, row) {
   	     		var status = row.status;
   	     		console.log(row)
				if (status) {
					//刷新表
					$('#manage_role').edatagrid("reload");
				}
				if (row.msg){
					layer.msg(row.msg)
				}
			},
			saveUrl: "/manage/role/addRole",
			updateUrl: "/manage/role/updateroleInfo",
   	  		toolbar:[
	         {text:'添加',iconCls:'icon-add',
	        	 handler:function(){
					 $('#manage_role').edatagrid('addRow', 0)
				 }
	         },
	         {text:'保存',iconCls:'icon-edit',
	        	//为按钮绑定单击事件
	        	 handler:function(){
	        			//获取选中行的数据
					 $('#manage_role').edatagrid('saveRow')
	         	 }
	         },
	         {text:'删除',iconCls:'icon-remove',
	        	 handler:function(){
	        		 //获取选中的行
	        		var objs=$('#manage_role').datagrid('getSelections');
	        		if(objs.length>0){
		        		$.messager.confirm('确认','您确认想要删除这<span style="color:red;">'+objs.length+'</span>条角色吗？',function(r){    
		        		    if (r){    
		        		        $.post({
		        		        	url:'/manage/role/deleteRole',
		        		        	data:JSON.stringify(objs),
		        		        	contentType:'application/json',
		        		        	success:function(data){
		        		        		windowsOperation(null,"manage_role",data);
		        		        	}
		        		        })    
		        		    }    
		        		}); 
	        		}else{
	        			topCommonMessage('至少要选择一行进行删除');
	        		}
	        	 }
	         
	         }, {
			  text: '权限查询', iconCls: 'icon-ok',
			  handler: function () {
				  //获取选中的行
				  var roles = $('#manage_role').datagrid('getSelections');
				  if (roles.length != 1) {
					  layer.msg("请选择角色来更新权限！")
					  return
				  }
				  //往自己元素后面添加
				  $('#manage_role').after("<div id='manageRolePermisssionmanage'></div>");
				  $("#manageRolePermisssionmanage").dialog({
					  title: '权限查询',
					  width: 800,
					  height: 700,
					  content: "<table id='manageRolePermisssionmanageTable'></table>",
					  onOpen: function () {
						  //初始化table，并赋值当前角色权限
						  var roleId = roles[0].roleId;
						  manageRolePermisssionmanageTableInit(roleId);
					  },
					  onClose: function () {
						  //从浏览器中清除
						  $("#manageRolePermisssionmanage").remove();

					  },
					  buttons: [{
						  text: '分配',
						  handler: function () {
							  //获取用户选中的行
							  var row = $('#manageRolePermisssionmanageTable').datagrid('getSelections');
							  var roleId = roles[0].roleId;
							  var permisssIds = [];
							  row.forEach(function (val) {
								  permisssIds.push(val.permissionId)
							  })
							  //根据选中的权限id，去为权限表赋值角色id
							  $.post({
								  url: "/manage/role/updatePermissionRoleId",
								  data: {permisssIds:permisssIds,roleId:roleId},
								  success: function (data) {

									  if (data.status == 200) {
										  //关闭角色框
										  $("#manageRolePermisssionmanage").dialog("close")
										  //更新菜单
										  loadTree();
									  }
									  layer.msg(data.msg)
								  }
							  })

						  }
					  }]
				  })
				  $("#manageRolePermisssionmanage").dialog('center')
			  }
		  }
	         ]
   	    });
   	
  	})
	//权限树的初始化
	function manageRolePermisssionmanageTableInit(roleId) {
		$("#manageRolePermisssionmanageTable").datagrid({
			idField:"permissionId",
			url: '/manage/role/selectPermission?roleId='+roleId,
			columns:[[
				{field:'permissionId',title:'ID',checkbox:true},
				// {field:'permissionId',title:'ID',width:120,sortable:true,hidden:true},
				{field:'permissionName',title:'权限名称',width:120},
				{field:'permissionCode',title:'权限标识',width:120},
				{field:'permissionUrl',title:'权限路径',width:210},
				{field:'permissionDescription',title:'权限描述',width:210},
				{field:'roleId',title:'是否分配',width:80,formatter: function(value,row,index){
						if (value){
							return "<span style='color: #CC2222'>已分配</span>";
						} else {
							return "<span style='color: #3c8b3c'>未分配</span>";
						}
					}
				},

			]],
			onLoadSuccess:function(data){
				var row = $('#manage_role').datagrid('getSelections');
				var roleId = row[0].roleId;
				var permiss = commonAjax("get","/manage/role/selectPermissionByRoleId",{roleId:roleId});

				permiss.forEach(function (value) {
					$.each(data.rows,function(idx,val){//遍历JSON
						if(val.permissionId==value.permissionId){
							$('#manageRolePermisssionmanageTable').datagrid("selectRow", idx);//如果数据行为已选中则选中改行
						}
					});
				})
			}
		})

	}
    </script>
</body>
</html>